// The Vue build version to load with the `import` command
// (runtime-only or standalone) has been set in webpack.base.conf with an alias.
import Vue from 'vue'
import ElementUI from 'element-ui'
import 'element-ui/lib/theme-default/index.css'
import axios from 'axios'
import VueAxios from 'vue-axios'
import App from './App'
// import routers from '@/router/index.js'
//mintUI
import MintUI from 'mint-ui'
import 'mint-ui/lib/style.css'
// ======路由=====
import VueRouter from 'vue-router'
import Kuayu from '@/components/kuayu'
import Todo from '@/components/todo'
import List from '@/base/list'
import Form from '@/base/form'
import ComponentPage from '@/base/componentPage'
import MessagePass from '@/base/messagePass'
import Transition from '@/base/transition'
import Video from '@/base/video'
import VideoPlay from '@/base/videoPlay'
import MintScroll from '@/base/mintScroll'
Vue.use(VueRouter)
Vue.use(MintUI)
Vue.directive('css',{
    //插入之后执行  el:当前元素  bind:绑定的值，打印自己看
    inserted(el,bind){
        console.log('inserted');
        console.log(bind);
        var obj = bind.value;
        var arr = [];
        for(let key in obj){
            arr.push(key+':'+obj[key]);
        }
        var style = arr.join(';');
        el.style.cssText = arr;
    },
    //绑定的时候执行
    // bind(el,bind){
    //     console.log('bind');
    // }
})

let routes = [
    {
        path:'/',
    },
    {
        path:'/kuayu',
        component:Kuayu
    },
    {
        path:'/todo',
        component:Todo
    },
    {
        //基础知识 base中 列表数据同步更新方法
        path:'/list',
        component:List
    },
    {
        path:'/form',
        component:Form
    },
    {
        path:'/component',
        component:ComponentPage
    },
    {
        path:'/messagePass',
        component:MessagePass
    },
    {
        path:'/transition',
        component:Transition
    },{
        path:'/video',
        component:Video,
        children:[
            {
                path:'videoPlay/:id',
                component:VideoPlay,
            }
        ]
    },{
        path:'/mintScroll',
        component:MintScroll
    },
];

const router = new VueRouter({
    linkActiveClass:'active',
    routes
})

// console.log(routers);
Vue.use(VueAxios, axios)
Vue.use(ElementUI)
Vue.config.productionTip = false

/* eslint-disable no-new */
new Vue({
  el: '#app',
  router,
  template: '<App/>',
  components: { App }
})
